<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    *{
        font-family: 微软雅黑;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    .header{
        text-align: center;
        background: url("images/京东背景图.png");
        width: 190px;
        height: 260px;
    }
    .title{
        color: white;
        padding-top: 20px;
    }
    .one{
        padding-top: 100px;
    }
    span{
        margin-top: 10px;
        display: inline-block;
        width: 34px;
        text-align: center;
        background-color: #2f3430;
        margin-right: 12px;
        color: white;
        font-size: 20px;
    }
    p{
        color: white;
        font-size: 18px;
    }
</style>
<body>
<div class="header">
    <h1 class="title">京东秒杀</h1>
   <div class="one">
       <p>18:00点场 倒计时</p>
       <span id="shi">00</span>
       <span id="fen">00</span>
       <span id="miao">00</span>
   </div>
</div>

<script>
    //京东秒杀倒计时
    function Time() {
        var endtime = new Date('2019/9/4 20:5:00');
        var nowtime = new Date();
        var t = endtime.getTime() - nowtime.getTime();
        if (t>0){
            var s = Math.floor(t/1000/60/60);
            var f = Math.floor(t/1000/60%60);
            var m = Math.floor(t/1000%60);
            s <10 ? s = '0' +s :s =s;
            f <10 ? f = '0' +f :f =f;
            m <10 ? m = '0' +m :m =m;
            document.getElementById('shi').innerHTML = s;
            document.getElementById('fen').innerHTML = f;
            document.getElementById('miao').innerHTML = m;
        }else {
        }
    }
    Time();
    setInterval(Time,1000);
</script>
</body>
</html>